<template>
  <div class="app-container org">
    <el-dialog :class="'el-dialog-theme3'" append-to-body draggable :close-on-click-modal="false"
      v-model="open" title="选择仪器" width="700" @close="closedDialog">
      <p class="pinformation">搜索条件</p>
      <el-form label-width="80" ref="queryRef" :model="queryParams" :inline="true" @submit.native.prevent>
            <el-form-item label="仪器：" prop="code">
              <el-input maxlength="100" clearable placeholder="请输入编号、名称、型号" v-model.trim="queryParams.code"
                @keyup.enter="handleQuery" />
            </el-form-item>
            <el-form-item>
            <el-button type="success" @click="handleQuery">搜索</el-button>
              <el-button class="business resetBtn" @click="resetQuery">重置</el-button>
              </el-form-item>
      </el-form>
      
      <el-table ref="mainTableRef" :data="checkList" v-loading="loading" height="45vh" highlight-current-row @current-change="handleCurrentChange" >
        <el-table-column show-overflow-tooltip label="仪器编号" align="center" prop="number" width="150" />
        <el-table-column show-overflow-tooltip label="仪器型号" align="center" prop="code"/>
        <el-table-column show-overflow-tooltip label="仪器名称" align="center" prop="name" width="150" />
      </el-table>
      <pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum"
        v-model:limit="queryParams.pageSize" @pagination="getList" :layout="layout"/>
      <template #footer>
        <div class="dialog-footer">
          <el-button type="success" @click="handleDefine">确定</el-button>
          <el-button type="danger" @click="open = false">关闭</el-button>
        </div>
      </template>
    </el-dialog>
  </div>
</template>

<script setup>
import {
  listCheck,
  insertCheck,
  delCheck,
  clearCheck
} from "@/api/resource/check";
import bus from "@/utils/eventBus";

import { watch } from "vue";
const { proxy } = getCurrentInstance();
const queryParams = ref({ pageNum: 1, pageSize: 10 });
const checkList = ref([]);
const loading = ref(false);
const open = ref(true);
const total = ref(0);
const selectedId = ref();
const layout = ref("total, sizes, prev, pager, next, jumper")
const props = defineProps({
  params: {
    type: Object,
  },
});

function getList() {
  loading.value = true;
  listCheck(queryParams.value).then((res) => {
    loading.value = false;
    checkList.value = res.rows;
    total.value = res.total;
    nextTick(() => {
      checkList.value.forEach((item) => {
        if (item.checkId) {
          proxy.$refs["mainTableRef"].setCurrentRow(item);
        }
      });
    });
  });
}

function handleQuery() {
  queryParams.value.pageNum = 1;
  getList();
}
handleQuery();
function resetQuery() {
  proxy.resetForm("queryRef");
  handleQuery();
}

function openShow(val) {
  open.value = true;
}
function handleCurrentChange(currentRow, oldCurrentRow) {
  if(!currentRow){
    selectedId.value = null;
    return;
  }
  selectedId.value = currentRow.instrumentId;
}


// ---------------------------勾选复选框提交------------------------
function handleCheckbox(selection, row) {
  if (!row.checkId) {
    insertCheck([row.instrumentId]).then((res) => {
      getList();
    });
  } else {
    delCheckin([row.checkId]).then((res) => {
      getList();
    });
  }
}

function handleAllCheckbox(selection) {
  if (selection.length > 0) {
    let jsonData = {
      sJIds: selection.map((item) => item.sJId),
    };
    // addSelectSample(jsonData).then((res) => {
    //   proxy.$modal.msgSuccess("保存成功");
    //   checkId.value = res.data;
    //   getCount();
    // });
  } else {
    // removeSelectSample({
    //   sJIds: checkList.value.map((item) => item.sJId),
    //   checkId: checkId.value,
    // }).then((res) => {
    //   proxy.$modal.msgSuccess("保存成功");
    //   getCount();
    // });
    // checkList.value.forEach((item) => {
    //   delete item.checkId;
    // });
  }
}

function dialogClose() {
  queryParams.value = { pageNum: 1, pageSize: 10 };
  checkList.value = [];
  total.value = 0;
}

function handleAllRemove() {
  proxy.$modal.confirm("您当前已经选择了仪器，确认要删除吗？").then(() => {
    clearCheck().then((res) => {
      proxy.$modal.msgSuccess("删除成功");
      getList();
    });
  });
}

const emit = defineEmits(["closeDialog"]);
function closedDialog() {
  emit("closeDialog");
}
function handleDefine() {
  loading.value = true;
  if(!selectedId.value){
    proxy.$modal.msgError(`请选择仪器！`);
    loading.value = false;
    return false;
  }
  insertCheck(selectedId.value).then(res => {
    loading.value = false;
    emit("closeDialog");
    bus.emit("refresh")
  }).catch(res => {
    loading.value = false;
  })
}
function cellClass(row) {
  if (row.columnIndex === 0) {
    return 'DisableSelection'
  }
}
// 记得暴露
defineExpose({
  openShow,
});
</script>

<style>
.el-table__header .DisableSelection .cell {
  visibility: hidden;
}
</style>
